|
错误原因： 生成海报为了方便调用，将canvas封装在了子组件中。 绘制完海报后，调用uni.canvasToTempFilePath()保存canvas为图片会提示错误信息：canvasToTempFilePath: fail canvas is empty 通过百度了解，在微信小程序子组件中调用canvasToTempFilePath时，需要额外增加一个this uni.canvasToTempFilePath(object, component,this)
ctx.draw(true, (ret) => { // draw方法 把以上内容画到 canvas 中。
setTimeout(()=>{
uni.canvasToTempFilePath({ // 保存canvas为图片
canvasId: 'myCanvas',
quality: 1,
width:this.canvasW,
height:this.canvasH,
destWidth:this.canvasW,
destHeight:this.canvasH,
complete: (res)=> {
// 在H5平台下，tempFilePath 为 base64,
// 图片提示跨域 H5保存base64失败，APP端正常输出临时路径
if(res.tempFilePath){
// 小程序中，将res.tempFilePath转为base64,并保存图片
uni.getFileSystemManager().readFile({
filePath: res.tempFilePath,
encoding: 'base64',
success: res => {
let base64 = 'data:image/png;base64,' + res.data;
this.$http.post("Users/base64_upload", {
image: base64
}).then(res => {
if (res.code == 200) {
uni.showToast({
icon: 'success',
mask: true,
title: '完成',
});
this.ewm = this.$imgUrl+res.data;
}
})
}
})
}
},
},this) // 这里是新增的this，只有在微信小程序中需要加入，不然会报错
},1000)
});
|